<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="UTF-8">
    <title>WISSC轮滑教培服务网-查询系统</title>
    <#assign base=request.contextPath  />
    <link rel="icon" href="${base}/favicon.ico">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link rel="stylesheet" href="${base}/frame/layui/css/layui.css?t=1534970980648" media="all">
    <script type="text/javascript" src="${base}/js/feng.js"></script>
    <script src="${base}/frame/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="${base}/js/ztree/jquery-1.4.4.min.js"></script>
    <script src="${base}/js/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="${base}/css/hzw-city-picker.css">
    <script type="text/javascript" src="${base}/js/city-data.js"></script>
    <script type="text/javascript" src="${base}/js/hzw-city-picker.min.js"></script>
    <script type="text/javascript" src="${base}/js/threeLevelLinkage/worldAddress.js"></script>
    <script type="text/javascript" src="${base}/js/threeLevelLinkage/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="${base}/js/threeLevelLinkage/TestAddress.js"></script>
    <script type="text/javascript" src="${base}/js/threeLevelLinkage/TestChooseAddress.js"></script>
    <script type="text/javascript" src="${base}/js/city-zk.js"></script>
    <script type="text/javascript" src="${base}/js/province.js"></script>
    <style type="text/css">
        form {
            padding: 10px;
        }

        .layui-btn-radius {
            border-radius: 3px;
        }
    </style>
    <script>
        var defaults = {
            s1: 'provid',
            s2: 'cityid',
            s3: 'areaid',
            v1: null,
            v2: null,
            v3: null
        };
    </script>


</head>
<body>
<form class="layui-form" id="myform">
    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;姓名</label>
        <div class="layui-input-inline">
            <input name="name" id="name" lay-verify="required" autocomplete="off" class="layui-input isNull"
                   type="text">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;性别</label>
        <div class="layui-input-inline">
            <input type="radio" name="sex" id="man" value="1" title="男" checked>
            <input type="radio" name="sex" id="wuman" value="2" title="女">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;身份证号</label>
        <div class="layui-input-inline">
            <input name="idNumber" id="idNumber" lay-verify="required" autocomplete="off" class="layui-input isNull"
                   type="text">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;出生日期</label>
        <div class="layui-input-inline">
            <input name="birth" id="birth" lay-verify="required" autocomplete="off" class="layui-input isNull"
                   type="text">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;所属战队</label>
        <div class="layui-input-inline">
            <input name="combat" id="combat" lay-verify="required" autocomplete="off" class="layui-input isNull"
                   type="text">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;赛龄</label>
        <div class="layui-input-inline">
            <input name="raceAge" id="raceAge" lay-verify="required" autocomplete="off" class="layui-input isNull"
                   type="text">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;是否参加城市排名</label>
        <div class="layui-input-inline">
            <select name="cityRanking" lay-verify="required" id="cityRanking" class=" isNull">
                <option value="">请选择</option>
                <option value="1">是</option>
                <option value="2">否</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;是否参加省份排名</label>
        <div class="layui-input-inline">
            <select name="provinceRanking" lay-verify="required" id="provinceRanking" class=" isNull">
                <option value="">请选择</option>
                <option value="1">是</option>
                <option value="2">否</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><a style="color:red">*</a>&nbsp;是否参加国家排名</label>
        <div class="layui-input-inline">
            <select name="nationalRanking" lay-verify="required" id="nationalRanking" class=" isNull">
                <option value="">请选择</option>
                <option value="1">是</option>
                <option value="2">否</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label"><a style="color:red">*</a>&nbsp;选择地区</label>
            <div class="layui-input-inline">
                <select name="provid" id="provid" lay-filter="provid" lay-verify="required" class="isNull">
                    <option value="">请选择国家</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <div class="layui-input-inline">
                <select name="cityid" id="cityid" lay-filter="cityid" lay-verify="required">
                    <option value="">请选择省</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <div class="layui-input-inline">
                <select name="areaid" id="areaid" lay-filter="areaid" lay-verify="required">
                    <option value="">请选择市</option>
                </select>
            </div>
        </div>
    </div>


    <div style="width: 120px;  background-color: #0092EF;padding: 10px 15px;border-radius: 3px; margin-bottom: 10px; ">
        <i class="layui-icon layui-icon-add-circle" style="color: white " id="YGW">添加赛事经历</i>
    </div>
    <div id="demo"></div>

    <div class="layui-upload">
        <button type="button" class="layui-btn" id="test1" style="background-color: #0092EF;">个人照片</button>
        <div class="layui-upload-list" id="url">
            <img class="layui-upload-img " name="demo1" id="demo1" style="width:88px;height:88px">
            <p id="demoText"></p>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-inline">
            <button class="layui-btn " lay-submit lay-filter="formDemo" type="button"
                    onclick="onSubmit()" style="background-color: #0092EF;">立即提交
            </button>
            <button type="reset" class="layui-btn layui-btn-primary layui-btn-radius">重置</button>
        </div>
    </div>
</form>
<script>
    function resetText() {
        document.getElementById("myform").reset();
    }
</script>
<script>
    layui.use('upload', function () {
        var $ = layui.jquery
            , upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            , url: '${base}/file/uploadFile'
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#demo1').attr('src', result); //图片链接（base64）
                });
            }
            , done: function (res) {
                //上传成功
                a = res.data;
                return res.data;
            }
            , error: function () {
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function () {
                    uploadInst.upload();
                });
            }
        });
    })
</script>
<script>
    var idFlag = 0;

    layui.use(['form', 'layedit', 'laydate', 'layer'], function () {
        var s = 1;
        var form = layui.form
            , layer = layui.layer
            , layedit = layui.layedit
            , laydate = layui.laydate;

        function timeAdd() {
            lay('.datetime').each(function () {
                laydate.render({
                    elem: this,
                    trigger: 'click'
                });
            });
        }

        //执行一个laydate实例
        laydate.render({
            elem: '#birth' //指定元素
        });
        $("#YGW").click(function () {
            for (var i = 0; i < 1; i++) {
                $("#demo").append('<div id ="count' + idFlag + '">' +
                    '<div class="layui-form-item">' +
                    '<div class="layui-inline">' +
                    '<label class="layui-form-label"><a style="color:red">*</a>赛事日期</label>' +
                    '<div class="layui-input-inline">' +
                    '<input name="matchTime" id="matchTime' + idFlag + '" lay-verify="required" autocomplete="off" class="layui-input isNull datetime"  type="text">' +
                    '</div>' +
                    '</div>' +
                    '<div class="layui-inline">' +
                    '<label class="layui-form-label"><a style="color:red">*</a>赛事名称</label>' +
                    '<div class="layui-input-inline">' +
                    '<input name="matchName" id="matchName' + idFlag + '" lay-verify="required" autocomplete="off" class="layui-input isNull"' + 'type="text">' +
                    '</div>' +
                    '</div>' +
                    '<div class="layui-inline">' +
                    '<label class="layui-form-label"><a style="color:red">*</a>获得名次</label>' +
                    '<div class="layui-input-inline">' +
                    '<input name="ranking" id="ranking' + idFlag + '" lay-verify="required" autocomplete="off" class="layui-input isNull"' + 'type="text">' +
                    '</div>' +
                    '</div>' +
                    '<div class="layui-inline">' +
                    '<label class="layui-form-label"><a style="color:red">*</a>获得积分</label>' +
                    '<div class="layui-input-inline">' +
                    '<input name="integral" id="integral' + idFlag + '" lay-verify="required" autocomplete="off" class="layui-input isNull"' + 'type="text">' +
                    '</div>' +
                    '<button style="background-color: #e7141a;margin-left: 10px" type="button"  class="layui-btn" onclick="deleteA(' + idFlag + ')" >删除</button>' +
                    '</div>' +
                    '</div>' +
                    '</div>');
                idFlag += 1;
                form.render();
                timeAdd();
            }
        })
    });

    //添加
    function onSubmit() {
        if (!isNull()) {
            return;
        }
        if (a == null || a == "" || a == undefined) {
            layer.msg('<span style="color:red; ">请上传个人照片</span>')
        }
        jsonData = {};
        var provid = $("#provid").val()
        var cityid = $("#cityid").val();
        var areaid = JSON.stringify($("#areaid").val());
        var str = areaid.replace(/^\"|\"$/g, '');
        var sum = provid + "/" + cityid + "/" + str + "/";
        jsonData.name = $("#name").val();
        jsonData.sex = $("input:radio[name='sex']:checked").val();
        jsonData.idNumber = $("#idNumber").val();
        jsonData.birth = new Date($("#birth").val()).getTime();
        jsonData.city = sum;
        jsonData.combat = $("#combat").val();
        jsonData.raceAge = $("#raceAge").val();
        jsonData.cityRanking = $("#cityRanking").val();
        jsonData.provinceRanking = $("#provinceRanking").val();
        jsonData.nationalRanking = $("#nationalRanking").val();
        jsonData.url = a;
        var aa = "";
        for (var i = 0; i < idFlag; i++) {
            var matchTime = matchTime + i;
            var matchName = matchName + i;
            var ranking = ranking + i;
            var integral = integral + i;
            matchTime = new Date($("#matchTime" + i).val()).getTime();
            matchName = $("#matchName" + i).val();
            ranking = $("#ranking" + i).val();
            integral = $("#integral" + i).val();
            aa += matchTime + "," + matchName + "," + ranking + "," + integral + "-";
        }
        $.ajax({
            type: "POST",
            traditional: true,//这里设置为true,不然后台接收到的参数会带上[]，导致数据无法正常接收
            url: "${base}/individualEvent/individualEventInsert",
            data: {param1: JSON.stringify(jsonData), param2: aa},
            success: function (data) {//返回数据根据结果进行相应的处理

                data = JSON.parse(data)
                if (data.flag === true) {
                    layer.msg("添加成功,请到个人信息查询模块查看")
                    setTimeout(function () {
                        window.location.href = "${base}/individualEvent/individual_add.html";
                    }, 1500)

                } else {
                    layer.msg(data.msg)
                }
            }
        });
    }

    //删除赛事经历
    function deleteA(flag) {
        $("#count" + flag).remove();
    }
</script>
</body>
</html>
